import type { IButtonMenu, IDomEditor } from "@wangeditor/editor";
import { Boot } from "@wangeditor/editor";

/**
 * 显示源代码
 */
class ShowSourceMenu implements IButtonMenu {
  public readonly tag: string;
  public readonly title: string;
  public readonly iconSvg?: string;
  public readonly alwaysEnable = true;

  constructor() {
    this.title = "源码";
    this.tag = "button";
    this.iconSvg =
      '<svg t="1665596742086" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3179" data-spm-anchor-id="a313x.7781069.0.i10" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M919.68 1015.68H104.96a95.36 95.36 0 0 1-95.36-95.36V105.6A96 96 0 0 1 104.96 9.6h814.72a96 96 0 0 1 96 96v814.72a96 96 0 0 1-96 95.36zM104.96 73.6a31.36 31.36 0 0 0-31.36 32v814.72a31.36 31.36 0 0 0 31.36 31.36h814.72a32 32 0 0 0 32-31.36V105.6a32 32 0 0 0-32-32z" fill="#323333" p-id="3180"></path><path d="M971.52 256H53.12a32 32 0 0 1 0-64h918.4a32 32 0 0 1 0 64zM442.24 886.4h-8.96a32 32 0 0 1-21.76-39.68l145.92-504.32a32 32 0 1 1 64 17.92l-148.48 503.04a32.64 32.64 0 0 1-30.72 23.04zM312.32 798.72a32 32 0 0 1-19.84-6.4l-186.88-142.72a31.36 31.36 0 0 1-12.16-24.96 32 32 0 0 1 11.52-25.6L291.84 448a32.64 32.64 0 0 1 45.44 5.12 32 32 0 0 1-5.12 44.8L177.28 623.36l154.24 117.76a32 32 0 0 1 5.76 44.8 30.08 30.08 0 0 1-24.96 12.8zM712.96 798.72a32 32 0 0 1-19.84-57.6l154.24-117.76-154.88-124.16a32 32 0 1 1 40.32-51.2l186.88 149.76a30.08 30.08 0 0 1 11.52 25.6 31.36 31.36 0 0 1-12.16 24.96l-186.88 142.72a31.36 31.36 0 0 1-19.2 7.68z" fill="#323333" p-id="3181"></path></svg>';
  }

  isActive(editor: IDomEditor): boolean {
    return false;
  }

  getValue(editor: IDomEditor): string | boolean {
    return false;
  }

  isDisabled(editor: IDomEditor): boolean {
    return false;
  }

  exec(editor: IDomEditor, value: string | boolean) {
    const codeDiv: any = document.querySelectorAll(".sourceBox")[0];
    const editorDiv: any = document.querySelectorAll(".editorBox")[0];

    if (codeDiv.style.display === "none" || codeDiv.style.display === "") {
      editorDiv.style.display = "none";
      codeDiv.style.display = "block";
    } else {
      editorDiv.style.display = "block";
      codeDiv.style.display = "none";
    }
  }
}

const showSourceMenuConf = {
  key: "showSource",
  factory() {
    return new ShowSourceMenu();
  }
};

export function useEditor() {
  Boot.registerMenu(showSourceMenuConf);
}
